<template>
  <view class="container">
	  <!-- 导航 -->
	  <uni-nav-bar
	    @clickLeft="goBack"
	    left-icon="back"
	    leftIcon="arrowleft"
	    title="提交订单"
	    statusBar="true"
	    fixed="true"
	    color="#000000"
	    backgroundColor="#ffffff"
	  ></uni-nav-bar>
    <!-- 顶部标题栏 -->
   <!-- <view class="header">
      <text class="title">确认订单</text>
    </view> -->

    <!-- 收货地址 -->
    <view class="address-section" @click="changeAddress()">
      <view class="address-tip">
        <text class="location-icon">📍</text> 
        <text class="tip-text">新增门牌号信息，为了您的地址准确，请完善信息  </text>
        <text class="arrow">></text>
      </view>
      <view class="address-content" v-if="defaultAddress !== null">
        <view class="address">{{defaultAddress.detail}}</view>
        <view class="user-info">{{defaultAddress.consignee}} {{defaultAddress.phone}}</view>
      </view>
	  <view class="address-content" v-else>
	    <view class="address">选择收货地址</view>
	    <view class="user-info">姓名 电话:xxxxx</view>
	  </view>
    </view>

    <!-- 商家信息 -->
    <view class="store-section">
      <view class="store-name">
        <text>川农乐购</text>
        <text class="delivery-type">尽快送达</text>
      </view>
      <view class="package">
        <text class="package-title">包裹1</text>
      </view>

      <!-- 商品列表 -->
      <view class="goods-list">
       
		<view class="goods-item" v-for="(item, index) in goodsList" :key="index">
          <image class="goods-img" :src="item.image" mode="aspectFill"></image>
          <view class="goods-info">
            <view class="goods-name">{{item.name}}</view>
            <view class="goods-spec" v-if="item.productTypeValue"> {{item.productTypeValue}} </view>
            <view class="price-count">
              <text class="price">¥ {{item.product.price}}</text>
              <text class="count">x {{item.number}}</text>
            </view>
          </view>
        </view>
      </view>

      <!-- 配送信息 -->
      <view class="delivery-section">
        <view class="delivery-title">配送方式</view>
        <view class="delivery-time">30分钟送货到寝</view>
      </view>

      <!-- 备注 -->
      <view class="remark-section">
        <view class="remark-title">留言</view>
        <view class="remark-input">给卖家留言：(50字以内)</view>
      </view>

      <!-- 金额明细 -->
      <view class="amount-section">
        <view class="amount-item">
          <text>商品金额</text>
          <text>¥ {{getTotalPrice}}</text>
        </view>
        <view class="amount-item">
          <text>店铺优惠</text>
          <text class="arrow-right"> 0 </text>
        </view>
        <view class="amount-item">
          <text>运费</text>
          <text>¥0</text>
        </view>
        <view class="amount-tip">查看本单不可用优惠 ></view>
      </view>
    </view>

    <!-- 支付方式 -->
    <view class="payment-section">
      <view class="payment-title">支付方式</view>
      <view class="payment-type">
        <text>线上支付</text>
        <text class="arrow-right">></text>
      </view>
    </view>

    <!-- 底部结算栏 -->
    <view class="bottom-bar">
      <view class="total">
        <text>合计：</text>
        <text class="price">¥{{getTotalPrice}}</text>
      </view>
      <view class="submit-btn" @click="orderPay()">提交订单</view>
    </view>
  </view>
</template>

<script src="./index.js"></script>
<style src="./../common/Navbar/navbar.scss" lang="scss" scoped></style>
<style src="./index.scss" lang="scss" scoped></style>
<style scoped>
/* #ifdef MP-WEIXIN || APP-PLUS */
::v-deep ::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  -webkit-appearance: none;
  background: transparent;
  color: transparent;
}

/* #endif */
</style>
